<template>
<view class="bargain-bd" :style="datas.cut_actor_info.length > 0? '' : 'height:100%;'">
  
  <!-- 好友砍价show -->
  <view class="bargain-wd" v-if="helpFriend">
    <view class="bargain-wdkj">
    <image src="/static/images/bargain-bg2.png"></image>
        <view class="friend-bargain">
            <view class="help-b">您已成功帮好友砍掉</view>
            <view class="bw-price">￥{{datas.user_cut_price.cut_price}}</view>
            <view class="get-chance">并且获得一次发起砍价的机会</view>
            <navigator class="invite" :url="'../../goods/goodsInfo/goodsInfo?goods_id=' + datas.bargain_info.goods_id + '&item_id=' + (datas.bargain_first_info.item_id > 0?datas.bargain_first_info.item_id:'')">
                我也要砍价{{datas.bargain_info.end_price}}元购
            </navigator>
        </view>
    </view>
    <view class="bg-close" @tap="helpFriendFun">
    <image src="/static/images/bargain-close.png"></image>
    </view>
  </view>


<!-- 本人砍show -->
  <view class="bargain-wd" v-if="helpFriendMy">
    <view class="bargain-wdkjs">
     <image src="/static/images/kjh3306.png" style="margin-top:130px;"></image>
        <view class="bargain-wdkjs-padding">
            <view>你已经砍掉了<text style="color: #FF580C;">￥{{datas.user_cut_price.cut_price}}</text>元</view>
            <view class="get-chance-my">点击右上角分享，邀请更多好友来给你砍价吧 !</view>
            <view class="invites">
                <view @tap="helpFriendMyFun">知道了</view>
            </view>
        </view>
    </view>
  </view>


  <view class="bargain-rule" v-if="bargainRule">
      <view class="br-window">
        <view class="rule-top">
          <image src="/static/images/bargain-rule.png"></image>
        </view>
        <view class="rule-bottom" style="background: url(../../img/rule-content.png) no-repeat center center;background-size: 580rpx 450rpx;">
          <view class="rb-title">—  活动说明  —</view>
          <view>1、选择想买的商品分享到好友让他们帮你砍价；</view>
          <view>2、每位好友砍掉的金额随机；</view>
          <view>3、消费者须在有效期内购买砍价商品，逾期商品将恢复原价；</view>
          <view>4、砍价商品数量有限，商品售罄后，将无法购买，即使您已经发起了砍价；</view>
          <view>5、同一商品，同一用户仅可享受一次优惠价格；</view>
          <view>6、砍价活动不与其它优惠共享；</view>
          <view>7、订单提交后，未支付的订单超时将自动取消；</view>
        </view>
      </view>
      <view class="bg-close" id="bg-close" @tap="bargainClose">
        <image src="/static/images/bargain-close.png"></image>
      </view>
  </view>
  <view class="active-rule" @tap="bargainClose">活动规则</view>
  <view class="bargain-user">
    <view class="head-img">
      <image :src="datas.bargain_first_info.users.head_pic"></image>
    </view>
    <view class="bg-uname">{{datas.bargain_first_info.users.nickname}}</view>
    <view class="it-bargain">我在{{setting.appName || 'TPshop'}}发现一个好货，马上邀请好友来砍价~</view>
    <view class="c-details">
      <navigator class="product-img"><image :src="url + '/api/goods/goodsThumImages?goods_id=' + datas.bargain_info.goods_id + '&width=400&height=400'"></image></navigator>
       <view class="cd-title">{{datas.bargain_info.goods_name}}{{' '}}{{datas.bargain_first_info.spec_goods_price.key_name||''}}</view>
      <view class="c-details-right">
       
        <view class="cd-price cur-price">现价¥{{datas.bargain_first_info.end_price}}</view>
        <view class="cd-price org-cost ">原价¥{{datas.bargain_info.start_price}}</view>
         <view class="cd-price org-cost ">数量{{datas.bargain_first_info.goods_num}}</view>
      </view>
    </view>

  </view>
  <view class="count-down">
    <view class="c-time">
      <view>距离结束还剩：</view>
      <view class="diamonds">{{d}}</view>
      : <view class="diamonds">{{h}}</view>
      : <view class="diamonds">{{m}}</view>
      : <view class="diamonds">{{s}}</view>
    </view>
    <view class="bargain-price">-  已砍 ¥{{datas.count_cut_price }} X {{datas.bargain_first_info.goods_num}} -</view>
    <view class="rail">
      <view class="bg-scale" :style="'width:' + bg_scale_data + ';'"></view>
      <view class="roundel" :style="'left:' + roundel_data + ';'"><image src="/static/images/bargain-local.png"></image></view>
    </view>
         <block v-if="!end">
    <view class="bargain-btn flex" :hidden="datas.bsgf">

      <view v-if="!over" class="cd-btn direct-btn flex-help-btn" @tap.stop="buy_now" :data-id="datas.bargain_first_info.order_id == 0 ?datas.bargain_info.goods_id:''">{{datas.bargain_first_info.order_id == 0 ? '直接要了' : '已购买'}}</view>
        <view class="cd-btn" v-else style="background-color:#999999;box-shadow:0 0.064rem 0.32rem 0 #999999;">活动已结束</view>
       
      <button class="cd-btn help-btn " :hidden="over" open-type="share" :style="'background-color:' + datas.btodo.bg_css + ';box-shadow:' + datas.btodo.border_css + ';margin:auto;'">{{datas.btodo.text?datas.btodo.text:'喊人帮砍'}}</button>

    </view>

 <view class="bargain-btn " :hidden="!datas.bsgf">
      <navigator class="cd-btn direct-btn" :url="'../../goods/goodsInfo/goodsInfo?goods_id=' + datas.bargain_info.goods_id + '&item_id=' + (datas.bargain_first_info.item_id?datas.bargain_first_info.item_id:'')">我也要{{datas.bargain_info.end_price}}元拿</navigator>
      <view class="cd-btn help-btn" @tap="cut" :data-id="datas.user_cut_price.user_id" :data-first="datas.bargain_first_info.id" :style="'background-color:' + datas.ctodo.bg_css + ';box-shadow:' + datas.ctodo.border_css + ';'">
      {{datas.ctodo.text || '帮好友砍价'}}
      </view>
    </view>
        </block>
  </view>

    <view class="bargain-list" v-if="datas.cut_actor_info.length > 0">
    <view style="background: url(../../../images/hengxian1.png) no-repeat center center;background-size: 346rpx 5rpx" class="list-title">我的砍价榜</view>
    <scroll-view scroll-y="true" class="bg-detail">
      <view v-for="(item, index) in datas.cut_actor_info" :key="index" class="member">
        <image class="bg-head" :src="item.head_pic?item.head_pic:defaultAvatar"></image>
        <view class="bg-friend">{{item.nickname?item.nickname:item.user_id + '用户'}}</view>
        <view class="bged">
          <image src="/static/images/kjje.png"></image>
          <view class="cut-n">砍掉<view class="cn-p">{{item.cut_price}}元</view></view>
        </view>
      </view>          
    </scroll-view>
  </view>
</view>
</template>

<script>
// pages/index/index.js
var app = getApp();
var request = app.globalData.request;
var common = require("../../../utils/common.js");
var setting = app.globalData.setting;
var util = require("../../../utils/util.js");

export default {
  data() {
    return {
      url: setting.url,
      setting: app.globalData.setting,
      defaultAvatar: setting.resourceUrl + "/static/static/images/user68.jpg",
      bargainRule: false,
      helpFriend: false,
      helpFriendMy: false,
      over: false,
      userInfo: [],
      datas: [],
      timer: null,
      d: '00',
      h: '00',
      m: '00',
      s: '00',
      bg_scale_data: '0rem',
      roundel_data: '0rem',
      is_cut: false,
      end: false
    };
  },

  components: {},
  props: {},

  /**
   * 生命周期函数--监听页面加载
   */
  onLoad: function (options) {
    var that = this;
    uni.setStorageSync('is_read', false);
    uni.setStorageSync('is_read_f', false);

    if (options.first_leader) {
      uni.setStorageSync('first_leader', options.first_leader);
    }

    that.getBragainGoods(options.id);
  },

  /**
   * 生命周期函数--监听页面初次渲染完成
   */
  onReady: function () {},

  /**
   * 生命周期函数--监听页面显示
   */
  onShow: function () {
    if (this.datas != '' && this.datas.bargain_first_info.id) {
      this.getBragainGoods(this.datas.bargain_first_info.id);
    }
  },

  /**
   * 生命周期函数--监听页面隐藏
   */
  onHide: function () {},

  /**
   * 生命周期函数--监听页面卸载
   */
  onUnload: function () {},

  /**
   * 页面相关事件处理函数--监听用户下拉动作
   */
  onPullDownRefresh: function () {},

  /**
   * 页面上拉触底事件的处理函数
   */
  onReachBottom: function () {},

  /**
  * 转发按钮
  */
  onShareAppMessage: function (res) {
    var that = this;
    return {
      title: '砍价活动',
      //自定义转发标题
      path: '/pages/Bargain/bargain/bargain?id=' + that.datas.bargain_first_info.id + '&first_leader=' + uni.getStorageSync('app:userInfo')['user_id']
    };
  },
  methods: {
    bargainClose: function (e) {
      this.setData({
        bargainRule: !this.bargainRule
      });
    },
    helpFriendMyFun: function () {
      this.setData({
        helpFriendMy: !this.helpFriendMy
      });
      uni.setStorageSync('is_read', true);
    },
    helpFriendFun: function () {
      this.setData({
        helpFriend: !this.helpFriend
      });
      uni.setStorageSync('is_read_f', true);
    },
    getBragainGoods: function (id) {
      var that = this;
      request.get('/api/Bargain/show_bargain', {
        data: {
          bargain_first_id: id
        },
        successReload: true,
        success: function (res) {
          var userInfo = uni.getStorageSync('app:userInfo');
          that.setData({
            userInfo: userInfo ? userInfo : []
          });

          if (res.data.status == 1) {
            res.data.result.bargain_first_info.users.head_pic = res.data.result.bargain_first_info.users.head_pic ? common.getFullUrl(res.data.result.bargain_first_info.users.head_pic) : that.defaultAvatar;
            res.data.result.cut_actor_info.forEach(function (item, index) {
              item.head_pic = item.head_pic ? common.getFullUrl(item.head_pic) : that.defaultAvatar;
            });
            that.setData({
              datas: res.data.result
            });
            that.createActivityTimer();
            that.checkLoad();
          } else {
            that.setData({
              end: true
            });
            app.globalData.showTextWarining(res.data.msg, function () {
              uni.navigateBack({
                delta: 1
              });
            });
          }
        } //failStatus(){}

      });
    },
    //加载初始化砍价逻辑
    checkLoad: function () {
      var that = this;
      var data = that.datas;
      var userInfo = that.userInfo; //当前用户是否砍价

      if (userInfo != '' && userInfo.user_id == (data.user_cut_price != null ? data.user_cut_price.user_id : 0)) {
        that.setData({
          'datas.ctodo.click': false,
          'datas.ctodo.text': '已帮好友砍过价',
          'datas.ctodo.bg_css': '#999999',
          'datas.ctodo.border_css': '0 0.064rem 0.32rem 0 #999999'
        });
      } //判断当前用户是否是发起人


      if (data.bargain_first_info.user_id == userInfo.user_id && userInfo.user_id > 0) {
        that.setData({
          'datas.bsgf': false,
          helpFriendMy: uni.getStorageSync('is_read') ? false : true
        });
      } else {
        that.setData({
          'datas.bsgf': true,
          helpFriend: that.is_cut ? uni.getStorageSync('is_read_f') ? false : true : false
        });
      } //计算进度条


      let bargain_first_end_price = Number(data.bargain_first_info.end_price);
      let bargain_end_price = Number(data.bargain_info.end_price);
      let bargain_start_price = Number(data.bargain_info.start_price);
      let count_cut_price = data.user_cut_price != null ? data.user_cut_price.cut_price : 0;
      let order_id = Number(data.bargain_first_info.order_id);
      let w = 13.4 / (bargain_start_price - bargain_end_price);
      let l = 12.66 / (bargain_start_price - bargain_end_price);

      if (bargain_first_end_price == bargain_end_price) {
        that.setData({
          bg_scale_data: '13.4rem',
          roundel_data: '12.66rem',
          'datas.ctodo.click': false,
          'datas.ctodo.text': '砍价已完成',
          'datas.ctodo.bg_css': '#999999',
          'datas.ctodo.border_css': '0 0.064rem 0.32rem 0 #999999',
          'datas.btodo.click': false,
          'datas.btodo.text': '砍价已完成',
          'datas.btodo.bg_css': '#999999',
          'datas.btodo.border_css': '0 0.064rem 0.32rem 0 #999999'
        });
      } else {
        that.setData({
          bg_scale_data: w * count_cut_price + 'rem',
          roundel_data: l * count_cut_price + 'rem'
        });
      }

      if (Number(data.bargain_first_info.order_id) > 0) {
        that.setData({
          'datas.ctodo.click': false,
          'datas.ctodo.text': '已完成',
          'datas.ctodo.bg_css': '#999999',
          'datas.ctodo.border_css': '0 0.064rem 0.32rem 0 #999999',
          'datas.btodo.click': false,
          'datas.btodo.text': '已完成',
          'datas.btodo.bg_css': '#999999',
          'datas.btodo.border_css': '0 0.064rem 0.32rem 0 #999999',
          'datas.atodo.click': false,
          'datas.atodo.text': '已购买',
          'datas.atodo.bg_css': '#999999',
          'datas.atodo.border_css': '0 0.064rem 0.32rem 0 #999999'
        });
      }
    },

    /** 检查是否倒计时是否结束 */
    checkActivityTime: function () {
      var that = this;
      var t = that.datas.bargain_info.end_time * 1000 - new Date().getTime();

      if (t > 0) {
        var d = Math.floor(t / 1000 / 60 / 60 / 24);
        var h = Math.floor(t / 1000 / 60 / 60 % 24);
        var m = Math.floor(t / 1000 / 60 % 60);
        var s = Math.floor(t / 1000 % 60);
        if (s >= 0) if (d < 10) {
          d = '0' + d;
        }

        if (h < 10) {
          h = '0' + h;
        }

        if (m < 10) {
          m = '0' + m;
        }

        if (s < 10) {
          s = '0' + s;
        }

        that.setData({
          d: d,
          h: h,
          m: m,
          s: s
        });
      } else {
        //结束时
        that.setData({
          over: true
        });
        app.globalData.showTextWarining('活动已结束');
        that.destroyActivityTimer();
      }
    },

    /** 创建活动倒计时定时器 */
    createActivityTimer: function () {
      var that = this;
      that.timer = setInterval(function () {
        that.checkActivityTime();
      }, 1000);
    },

    /** 销毁活动倒计时定时器 */
    destroyActivityTimer: function () {
      if (this.timer) {
        clearInterval(this.timer);
        this.timer = null;
      }
    },
    buy_now: function (e) {
      var that = this;
      var id = e.currentTarget.dataset.id; //商品id

      var data = that.datas; //检查用户是否登录方可操作立即购买

      if (!app.globalData.auth.isAuth()) {
        app.globalData.showLoading(null, 1500);
        app.globalData.getUserInfo();
        return;
      } //发起人没购买，才可以购买商品


      if (id > 0) {
        if (Number(data.bargain_first_info.goods_num) <= Number(data.bargain_info.goods_num)) {
          var data = {
            goods_id: data.bargain_info.goods_id,
            item_id: data.bargain_first_info.item_id > 0 ? data.bargain_first_info.item_id : '',
            goods_num: data.bargain_first_info.goods_num,
            action: 'buy_now'
          };
          uni.navigateTo({
            url: '/pages/cart/cart2/cart2?' + util.Obj2Str(data)
          });
        } else {
          app.globalData.showTextWarining('购买数量超过此商品购买上限');
        }
      }
    },
    //砍价
    cut: function (e) {
      var that = this;
      var id = e.currentTarget.dataset.first; //检查用户是否登录方可操作立即购买

      if (!app.globalData.auth.isAuth()) {
        app.globalData.showLoading(null, 1500);
        app.globalData.getUserInfo();
        return;
      }

      request.post('/api/Bargain/bargain_cut', {
        data: {
          bargain_first_id: id
        },
        success: function (res) {
          if (res.data.status == 1) {
            that.setData({
              is_cut: true
            });
            that.getBragainGoods(that.datas.bargain_first_info.id);
          } else {
            app.globalData.showTextWarining(res.msg);
          }
        }
      });
    }
  }
};
</script>
<style>
page{
  height: 100%;
}
.bargain-bd{
  width: 100%;
  background: linear-gradient(to bottom,#FF6A52,#FE4747);
  overflow: hidden;
  position: relative;
}
.active-rule{
  height: 42rpx;
  width: 124rpx;
  background-color: #FFE1DC;
  border-radius: 21rpx;
  float: right;
  margin: 29rpx 30rpx 0 0;
  font-size: 22rpx;
  text-align: center;
  line-height: 42rpx;
  color: #ff6a00;
}
.bargain-user{
  width: 692rpx;
  height: 390rpx;
  background-color: #ffffff;
  margin: 122rpx auto;
  margin-bottom: 0;
  border-radius: 6rpx;
  position: relative;
  padding-top: 64rpx;
  text-align: center;
}
.head-img{
  position: absolute;
  height: 104rpx;
  width: 104rpx;
  left: 50%;
  margin-left: -52rpx;
  border: 4rpx solid #ffffff;
  border-radius: 50%;
  top: -60rpx;
  overflow: hidden;
}
.head-img image{
  width: 100%;
  height: 100%;
}
.bg-uname{
  font-size: 22rpx;
  color: #666666;
}
.it-bargain{
  font-size: 24rpx;
  color: #ff6a00;
  margin-top: 52rpx;
  font-weight: bold;
}
.c-details{
    height: 138rpx;
    width: 630rpx;
    background-color: #F3F3F3;
    border-radius: 6rpx;
    margin: 0 auto;
    margin-top: 62rpx;
    overflow: hidden;
}
.product-img{
  width: 138rpx;
  height: 138rpx;
  float: left;
}
.product-img image{
  height: 100%;
  width: 100%;
}
.c-details-right{
  display: flex;
  width: 490rpx;
  height: 138rpx;
  justify-content: space-between;
  box-sizing: border-box;
  text-align:left;
}
.flex{
    display: flex;
}
.flex-help-btn{
    margin-left: 36rpx;
}
.cd-title{
 margin-top:20rpx;
 text-align:left;
  font-size: 24rpx;
  line-height: 30rpx;
  overflow: hidden;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  width: 440rpx;
}
.cd-price{
  width: 50%;
  float: left;
  font-size: 24rpx;
  margin-top: 20rpx;
}
.cur-price{
  color: #ff3a3a;
}
.org-cost{
  color: #999999;
}
.count-down{
  box-sizing: border-box;
  width: 692rpx;
  height: 346rpx;
  border-radius:6rpx;
  background-color: #fff;
  margin: 30rpx auto;
  text-align: center;
  font-size: 24rpx;
  padding-top: 40rpx;
}
.c-time view{
  display: inline-block;
}
.diamonds{
  font-size: 22rpx;
  width: 30rpx;
  height: 30rpx;
  background-color: #000000;
  color: #ffffff;
  border-radius: 3px;
  text-align: center;
  line-height: 30rpx;
}
.bargain-price{
  font-size: 24rpx;
  color: #FE5C50;
  font-weight: bold;
  margin-top: 40rpx;
}
.rail{
  width:13.461333333333334rem;
  height: 12rpx;
  box-sizing:border-box;
  border: 1rpx solid #FFC019;
  border-radius: 6rpx;
  margin: 40rpx auto;
  position: relative;
  margin-bottom: 0;
}
.bg-scale{
  height: 100%;
  background-color: #FFC019;
}
.roundel{
  width: 36rpx;
  height: 36rpx;
  position: absolute;
  top: -12rpx;
}
.roundel image{
  height: 100%;
  width: 100%;
}
.bargain-btn{
  margin-top: 56rpx;
  width: 100%;
  text-align: center;
}
.cd-btn{
  width: 250rpx;
  height: 60rpx;
  background-color: #ffc019;
  display: inline-block;
  border-radius: 30rpx;
  text-align: center;
  line-height: 60rpx;
  color: #ffffff;
  font-size: 24rpx;
  box-shadow: 0 3rpx 6rpx 0 #FFC019;
}
.help-btn{
  width: 284rpx;
  background-color: #ff5c4d;
  box-shadow: 0 3rpx 6rpx 0 #ff5c4d;
  margin-left: 24rpx;
}
.bargain-list{
  height: 430rpx;
  width: 690rpx;
  background-color: #fe736e;
  margin: 30rpx auto;
  border-radius: 6rpx;
  overflow: hidden;
}
.list-title{
  text-align: center;
  color: #ffffff;
  font-size: 30rpx;
  margin-top: 46rpx;
}
.bg-detail{
  width: 630rpx;
  height: 292rpx;
  margin: 40rpx auto;
}
.member{
  height: 80rpx;
  width: 100%;
}
.bg-head{
  width: 52rpx;
  height: 52rpx;
  border-radius: 50%;
  float: left;
}
.bg-friend{
  float: left;
  line-height: 52rpx;
  font-size: 24rpx;
  color: #ffffff;
  padding-left: 28rpx;
}
.bged{
  float: right;
  line-height: 52rpx;
  font-size: 24rpx;
  color: #ffffff;
}
.bged image{
  width: 26rpx;
  height: 26rpx;
  position: relative;
  top:6rpx;
  margin-right: 10rpx;
}
.bged view{
  display: inline-block;
  line-height: 52rpx;
}
.cn-p{
  color: #ffe719;
}
.bargain-rule{
  height: 100%;
  width: 100%;
  background-color: rgba(0,0,0,.7);
  position: absolute;
  z-index: 1000;
}
.bargain-rule .br-window {
  background-color: #fff;
  width: 630rpx;
  height: 910rpx;
  margin: 0 auto;
  margin-top: 68rpx;
  margin-bottom: 55rpx;
}
.bargain-rule .br-window .rule-top {
  width: 100%;
  height: 393rpx;
}
.bargain-rule .br-window .rule-top image {
  width: 100%;
  height: 100%;
}
.bargain-rule .br-window .rule-bottom {
  width: 580rpx;
  height: 450rpx;
  margin: 0 auto;
  margin-top: 30rpx;
  overflow: hidden;
}
.bargain-rule .br-window .rule-bottom .rb-title {
  color: #FF544C;
  text-align: center;
  margin: 40rpx 0;
  font-weight: 600;
  font-size: 24rpx;
}
.bargain-rule .br-window .rule-bottom view {
  font-size: 22rpx;
  text-align: left;
  margin: 0 28rpx;
  line-height: 35rpx;
}
.bg-close{
  width: 60rpx;
  height: 60rpx;
  margin: 0 auto;
}
.bg-close image{
  width: 60rpx;
  height: 60rpx;
}
.bargain-wd{
  height: 100%;
  width: 750rpx;
  background-color: rgba(0,0,0,.7);
  position: absolute;
  z-index: 1000;
}
.bargain-wd .bargain-wdkj {
    width: 750rpx;
    height: 575rpx;
    margin-top: 254rpx;
    overflow: hidden;
    text-align: center;
    position: relative;
}
.bargain-wd .bargain-wdkjs {
    width: 18rem;
    height: 800rpx;
    margin-top: 254rpx;
    overflow: hidden;
    text-align: center;
    margin:0 auto;

}
.invites{
    width: 9.6rem;
    border-radius: 0.853rem;
    background-color: #FF580C;
    color: #ffffff;
    display: block;
    font-size: 0.6826666666666666rem;
    margin: 0 auto;
    line-height: 1.7066666666666668rem;
    margin-top:30rpx;
}

.get-chance-my{
    font-size:.75555rem;
}
.friend-bargain{
    position:absolute;
    top:0;
    margin:0 auto;
    width:750rpx;
    height:570rpx;
}
.bargain-wdkjs-padding{
    /* margin-top:320rpx; */
    padding:30px;
    position:absolute;
    top:215px;
}
/* .bargain-wd .bargain-wdkj view:first-child {
    margin-top: 161rpx;
    font-size: 32rpx;
    color: #333333;
} */
.help-b{
    margin-top: 105rpx;
    font-size: 32rpx;
    color: #333333;
}
.bargain-wd .bargain-wdkj view.bw-price {
    color:#ff6a00;
    font-size:90rpx;
    margin-top:8rpx;
    /* line-height:90rpx; */
}
.bargain-wd .bargain-wdkj view.get-chance {
    color:#FFC019;
    font-size:27rpx;
    margin-top:14rpx;
}
.bargain-wdkj image{
  width:640rpx;
  height:570rpx;
}
.invite{
    color:#333;
    text-decoration:none;
    vertical-align:middle;
    margin-top:110rpx;
    font-size:30rpx;
    background:linear-gradient(to bottom,#ebd9a7,#cdb65f);
    height:66rpx;
    width:296rpx;
    line-height:66rpx;
    border-radius:35rpx;
    margin:96rpx auto;
}
.bargain-wd .bg-close {
    width: 60rpx;
    height: 60rpx;
    border-radius: 50%;
    margin: 0 auto;
}
</style>